import styled from 'styled-components';
import px2vw from '@/utils/px2vw';

export const CalendarNow = styled.p`
  color: red;
  font-size: ${px2vw(12)};
  &::before{
    content: '';
    display:inline-block;
  }
`;

export const TestSpan = styled.span`
  font-size: ${px2vw(12)};
`;

export const Test = styled.div`
  width: 100%;
  overflow: auto;
  .innerContent{
    font-size: ${px2vw(12)};
  }
  .am-button{
    font-size:${px2vw(14)};
  }
  .react-calendar{
    width: 100%;
    border: none;
    .react-calendar__tile{ // 内部每一个块的高度
      height: 75px;
    }
    .react-calendar__navigation button[disabled]{ // 导航箭头禁用样式
      background-color: transparent;
    }
    .react-calendar__year-view__months__month{ // 内部块 当为月份的时候
      flex-basis: 20% !important;
      max-width: 20% !important;
    }
    .react-calendar__tile:disabled{ // 内部块的禁用样式
      background: transparent;
    }
    .react-calendar__tile:hover{ // 内部块的hover样式
      background: transparent;
      abbr{
        display: inline-block;
        background: #F05053;
        border-radius: 4px;
        width: 65%;
        height: 25px;
        line-height: 25px;
      }
    }
    .react-calendar__tile--now{ // 内部块的now样式
      background-color: transparent;
    }
  }
`;
